<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  
<script>
  // 问：什么时候使用箭头函数？
  // ps: 当我们把一个函数作为参数传到另一个函数的时候，用箭头函数比较多
  // setTimeout(function () {
  //   console.log(this)
  // }, 1000)

  // setTimeout(() => {
  //   console.log(this)
  // }, 1000)

  // 返回的都是window


  const obj = {
    fun1() {
      console.log(this)         // obj

      setTimeout(function () {
        console.log(this)       // window
      })

      setTimeout(() => {
        // 箭头函数寻找this时，依照最近作用域一层层找，找当前的上一层
        // 箭头函数无this, 一层一层往外找
        console.log(this)       // fun1对象
      })
    },
    fun2() {
      setTimeout(function () {
        setTimeout(function () {
         console.log(this)        // window
        })
        setTimeout(() => {
          console.log(this)       // window
        })
      })
      setTimeout(() => {
        setTimeout(function () {
          console.log(this)       // window
        })
        setTimeout(() => {
          console.log(this)       // obj
        })
      })
    }
  }

  obj.fun2()

  
</script>

</body>
</html>